<!DOCTYPE html>
<html prefix="og: http://ogp.me/ns#">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>基本类型与引用 &middot; pfan</title>
        <meta name="description" content="六种基本类型：  Undefined Null Boolean Number String Symbol   基本类型的值是不可变的，不能给基本类型添加属性和方法，如：
 var name = &#34;funnypan&#34;; name.toUpperCase(); //FUNNYPAN console.log(name); //funnypan  var person = &#34;funnypan&#34;; person.age = 30; person.method = function() {}; console.log(person.age); //undefined console.log(person.method); //undefined  基本类型的比较是值的比较，如：
 var a = 1; var b = true; console.log(a === b); //false console.log(a == b); //true  基本类型的变量存放在栈区（内存里的栈内存）
 var name = &#39;jozo&#39;; var city = &#39;guangzhou&#39;; var age = 22; Undefined Undefined 类型只有一个值，即 undefined，在使用 var 声明变量但未初始化时，该变量的值为 undefined">
        <meta name="HandheldFriendly" content="True">
        <meta name="MobileOptimized" content="320">
        <meta name="generator" content="Hugo 0.73.0" />
        <meta name="robots" content="index,follow">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta property="og:title" content="基本类型与引用">
<meta property="og:description" content="六种基本类型：  Undefined Null Boolean Number String Symbol   基本类型的值是不可变的，不能给基本类型添加属性和方法，如：
 var name = &#34;funnypan&#34;; name.toUpperCase(); //FUNNYPAN console.log(name); //funnypan  var person = &#34;funnypan&#34;; person.age = 30; person.method = function() {}; console.log(person.age); //undefined console.log(person.method); //undefined  基本类型的比较是值的比较，如：
 var a = 1; var b = true; console.log(a === b); //false console.log(a == b); //true  基本类型的变量存放在栈区（内存里的栈内存）
 var name = &#39;jozo&#39;; var city = &#39;guangzhou&#39;; var age = 22; Undefined Undefined 类型只有一个值，即 undefined，在使用 var 声明变量但未初始化时，该变量的值为 undefined">
<meta property="og:type" content="article">
<meta property="og:url" content="https://blog.steps.info/2020/05/19/%E5%9F%BA%E6%9C%AC%E7%B1%BB%E5%9E%8B%E4%B8%8E%E5%BC%95%E7%94%A8%E7%B1%BB%E5%9E%8B/">
        <link rel="stylesheet" href="https://blog.steps.info/dist/site.css">
        <link rel="stylesheet" href="https://blog.steps.info/dist/syntax.css">
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,600,700,300&subset=latin,cyrillic-ext,latin-ext,cyrillic">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
        
        
        
        
    </head>
    <body>
        
<script type="application/javascript">
var dnt = (navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack);
var doNotTrack = (dnt == "1" || dnt == "yes");
if (!doNotTrack) {
	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
	(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
	ga('create', 'XXX', 'auto');
	ga('set', 'anonymizeIp', true);
	ga('send', 'pageview');
}
</script>


        <div id="wrapper">
            <header class="site-header">
                <div class="container">
                    <div class="site-title-wrapper">
                        
                            <h1 class="site-title">
                                <a title="Homepage" href="https://blog.steps.info/">Homepage</a>
                            </h1>
                        
                        <a class="button-square" href="https://blog.steps.info/index.xml"><i class="fa fa-rss"></i></a>
                        
                            <a class="button-square button-social hint--top" data-hint="Twitter" title="Twitter" href="https://twitter.com/pangel3" rel="me">
                                <i class="fa fa-twitter"></i>
                            </a>
                        
                        
                        
                            <a class="button-square button-social hint--top" data-hint="Gitlab" title="Gitlab" href="https://gitlab.com/funnypan" rel="me">
                                <i class="fa fa-gitlab"></i>
                            </a>
                        
                        
                            <a class="button-square button-social hint--top" data-hint="Github" title="Github" href="https://github.com/RazzilDarkbrew" rel="me">
                                <i class="fa fa-github-alt"></i>
                            </a>
                        
                        
                            <a class="button-square button-social hint--top" data-hint="Stack Overflow" title="Stack Overflow" href="https://stackoverflow.com/users/7784704/stepsinfo" rel="me">
                                <i class="fa fa-stack-overflow"></i>
                            </a>
                        
                        
                        
                            <a class="button-square button-social hint--top" data-hint="Email" title="Email" href="mailto:gemini0525@foxmail.com">
                                <i class="fa fa-envelope"></i>
                            </a>
                        
                    </div>

                    <ul class="site-nav">
                        
                    </ul>
                </div>
            </header>

            <div id="container">


<div class="container">
    <article class="post-container" itemscope="" itemtype="http://schema.org/BlogPosting">
        <header class="post-header">
    <h1 class="post-title" itemprop="name headline">基本类型与引用</h1>
    
    <p class="post-date">
        <span>Published <time datetime="2020-05-19" itemprop="datePublished">Tue, May 19, 2020</time></span>
        <span>by</span>
        <span itemscope="" itemprop="author" itemtype="https://schema.org/Person">
            <span itemprop="name">
                <a href="https://github.com/RazzilDarkbrew" itemprop="url" rel="author">pfan</a>
            </span>
        </span>
    </p>
    
        <p class="post-reading post-line">
            <span>Estimated reading time: 2 min</span>
        </p>
    
</header>

        <div class="post-content clearfix" itemprop="articleBody">
    

    <h2 id="六种基本类型">六种基本类型：</h2>
<ul>
<li>Undefined</li>
<li>Null</li>
<li>Boolean</li>
<li>Number</li>
<li>String</li>
<li>Symbol</li>
</ul>
<blockquote>
<p>基本类型的值是不可变的，不能给基本类型添加属性和方法，如：</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">name</span> <span class="o">=</span> <span class="s2">&#34;funnypan&#34;</span><span class="p">;</span>
<span class="nx">name</span><span class="p">.</span><span class="nx">toUpperCase</span><span class="p">();</span> <span class="c1">//FUNNYPAN
</span><span class="c1"></span><span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">name</span><span class="p">);</span> <span class="c1">//funnypan
</span><span class="c1"></span>
<span class="kd">var</span> <span class="nx">person</span> <span class="o">=</span> <span class="s2">&#34;funnypan&#34;</span><span class="p">;</span>
<span class="nx">person</span><span class="p">.</span><span class="nx">age</span> <span class="o">=</span> <span class="mi">30</span><span class="p">;</span>
<span class="nx">person</span><span class="p">.</span><span class="nx">method</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{};</span>

<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">person</span><span class="p">.</span><span class="nx">age</span><span class="p">);</span> <span class="c1">//undefined
</span><span class="c1"></span><span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">person</span><span class="p">.</span><span class="nx">method</span><span class="p">);</span> <span class="c1">//undefined
</span></code></pre></div><blockquote>
<p>基本类型的比较是值的比较，如：</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">b</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>

<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">a</span> <span class="o">===</span> <span class="nx">b</span><span class="p">);</span> <span class="c1">//false
</span><span class="c1"></span><span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">a</span> <span class="o">==</span> <span class="nx">b</span><span class="p">);</span> <span class="c1">//true
</span></code></pre></div><blockquote>
<p>基本类型的变量存放在栈区（内存里的栈内存）</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">name</span> <span class="o">=</span> <span class="s1">&#39;jozo&#39;</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">city</span> <span class="o">=</span> <span class="s1">&#39;guangzhou&#39;</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">age</span> <span class="o">=</span> <span class="mi">22</span><span class="p">;</span>
</code></pre></div><p><img src="https://cdn.jsdelivr.net/gh/funnypan/pics@master/img/20190820100054.png" alt=""></p>
<h3 id="undefined">Undefined</h3>
<p>Undefined 类型只有一个值，即 undefined，在使用 var 声明变量但未初始化时，该变量的值为 undefined</p>
<blockquote>
<p>对未声明的变量进行 typeof 操作，也会返回 undefined</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">message</span><span class="p">;</span>

<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">message</span><span class="p">);</span> <span class="c1">//undefined
</span></code></pre></div><p><a href="../javascript/Undefined.md">Undefined</a></p>
<h3 id="null">Null</h3>
<p>Null 类型也只有一个值，即 null，表示空对象指针。</p>
<blockquote>
<p>undefined 派生自 null，null==undefined</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">car</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>

<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">car</span><span class="p">);</span> <span class="c1">//object
</span></code></pre></div><p><a href="../javascript/Null.md">Null</a></p>
<h3 id="boolean">Boolean</h3>
<p>Boolean 有两个值，即 true 和 false</p>
<table>
<thead>
<tr>
<th>数据类型</th>
<th>转换为 true 的值</th>
<th>转换为 false 的值</th>
</tr>
</thead>
<tbody>
<tr>
<td>Boolean</td>
<td>true</td>
<td>false</td>
</tr>
<tr>
<td>String</td>
<td>任何非空字符串</td>
<td>&ldquo;&quot;（空字符串）</td>
</tr>
<tr>
<td>Number</td>
<td>任何非零数字（包括无穷大）</td>
<td>0 和 NaN</td>
</tr>
<tr>
<td>Object</td>
<td>任何对象</td>
<td>null</td>
</tr>
<tr>
<td>Undefined</td>
<td>不适用</td>
<td>undefined</td>
</tr>
</tbody>
</table>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kc">true</span><span class="p">.</span><span class="nx">toString</span><span class="p">()</span><span class="sb">`asdf`</span><span class="p">.</span><span class="nx">toString</span><span class="p">();</span> <span class="c1">// &#39;true&#39; // &#39;asdf&#39;
</span><span class="c1"></span><span class="kc">NaN</span><span class="p">.</span><span class="nx">toString</span><span class="p">();</span> <span class="c1">// &#39;NaN&#39;
</span></code></pre></div><p><a href="../javascript/Boolean.md">Boolean</a></p>
<h3 id="number">Number</h3>
<blockquote>
<p>Number 类型包括整数、浮点数、NaN、Infinity 等，NaN 是唯一不等于自身的类型</p>
</blockquote>
<p><a href="../javascript/Number.md">Number</a></p>
<h3 id="string">String</h3>
<blockquote>
<p>String 类型即字符串，可用单双引号或``包含</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">let</span> <span class="nx">n</span> <span class="o">=</span> <span class="mi">3</span><span class="p">;</span>
<span class="kd">let</span> <span class="nx">m</span> <span class="o">=</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="mi">4</span><span class="p">;</span>
<span class="kd">let</span> <span class="nx">str</span> <span class="o">=</span> <span class="sb">`m + n = </span><span class="si">${</span><span class="nx">m</span><span class="p">()</span> <span class="o">+</span> <span class="nx">n</span><span class="si">}</span><span class="sb">`</span><span class="p">;</span> <span class="c1">// &#34;m + n = 7&#34;
</span></code></pre></div><p><a href="../javascript/String.md">String</a></p>
<h3 id="symbol">Symbol</h3>
<blockquote>
<p>Symbol 值表示唯一的标志符</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="nx">Symbol</span><span class="p">(</span><span class="s2">&#34;asdf&#34;</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">b</span> <span class="o">=</span> <span class="nx">Symbol</span><span class="p">(</span><span class="s2">&#34;asdf&#34;</span><span class="p">);</span>
<span class="nx">a</span> <span class="o">===</span> <span class="nx">b</span><span class="p">;</span> <span class="c1">// false
</span></code></pre></div><p><a href="../javascript/Symbol.md">Symbol</a></p>
<h2 id="引用类型">引用类型</h2>
<ul>
<li>Object</li>
<li>Array</li>
<li>Function</li>
<li>Date</li>
</ul>
<blockquote>
<p>和基本类型相反，引用类型的值是可变的</p>
<p>引用类型的值同时保存在栈内存和堆内存中的对象</p>
<p>引用类型的比较是引用的比较</p>
</blockquote>
<h3 id="object">Object</h3>
<blockquote>
<p>Object 类型是一组数据和功能的集合使用 new 后面跟对象类型或 Object.create 创建对象</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">person</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">Object</span><span class="p">();</span>
<span class="nx">person</span><span class="p">.</span><span class="nx">name</span> <span class="o">=</span> <span class="s2">&#34;Nicholas&#34;</span><span class="p">;</span>
<span class="nx">person</span><span class="p">.</span><span class="nx">age</span> <span class="o">=</span> <span class="mi">30</span><span class="p">;</span>

<span class="c1">//或
</span><span class="c1"></span><span class="kd">var</span> <span class="nx">person</span> <span class="o">=</span> <span class="p">{</span>
  <span class="nx">name</span><span class="o">:</span> <span class="s2">&#34;Nicholas&#34;</span><span class="p">,</span>
  <span class="nx">age</span><span class="o">:</span> <span class="mi">30</span>
<span class="p">};</span>
</code></pre></div><h3 id="array">Array</h3>
<blockquote>
<p>Array 表示数据的有序列表</p>
</blockquote>
<div class="highlight"><pre class="chroma"><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">colors</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">Array</span><span class="p">();</span>
<span class="c1">//或
</span><span class="c1"></span><span class="kd">var</span> <span class="nx">colors</span> <span class="o">=</span> <span class="nb">Array</span><span class="p">();</span>
<span class="c1">//或
</span><span class="c1"></span><span class="kd">var</span> <span class="nx">colors</span> <span class="o">=</span> <span class="p">[];</span>
</code></pre></div><p><a href="../javascript/Array.md">Array</a></p>

</div>

        <footer class="post-footer clearfix">
    
        <p class="post-tags">
            <span>Tagged:</span>
            
            
                <a href="/tags/js/">js</a>
            
        </p>
    

    <div class="share">
        
            <a class="icon-twitter" href="https://twitter.com/share?text=%e5%9f%ba%e6%9c%ac%e7%b1%bb%e5%9e%8b%e4%b8%8e%e5%bc%95%e7%94%a8&url=https%3a%2f%2fblog.steps.info%2f2020%2f05%2f19%2f%25E5%259F%25BA%25E6%259C%25AC%25E7%25B1%25BB%25E5%259E%258B%25E4%25B8%258E%25E5%25BC%2595%25E7%2594%25A8%25E7%25B1%25BB%25E5%259E%258B%2f"
                onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;">
                <i class="fa fa-twitter"></i>
                <span class="hidden">Twitter</span>
            </a>
        

        
            <a class="icon-facebook" href="https://www.facebook.com/sharer/sharer.php?u=https%3a%2f%2fblog.steps.info%2f2020%2f05%2f19%2f%25E5%259F%25BA%25E6%259C%25AC%25E7%25B1%25BB%25E5%259E%258B%25E4%25B8%258E%25E5%25BC%2595%25E7%2594%25A8%25E7%25B1%25BB%25E5%259E%258B%2f"
                onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;">
                <i class="fa fa-facebook"></i>
                <span class="hidden">Facebook</span>
            </a>
        

        
            <a class="icon-google-plus" href="https://plus.google.com/share?url=https%3a%2f%2fblog.steps.info%2f2020%2f05%2f19%2f%25E5%259F%25BA%25E6%259C%25AC%25E7%25B1%25BB%25E5%259E%258B%25E4%25B8%258E%25E5%25BC%2595%25E7%2594%25A8%25E7%25B1%25BB%25E5%259E%258B%2f"
              onclick="window.open(this.href, 'google-plus-share', 'width=490,height=530');return false;">
              <i class="fa fa-google-plus"></i>
                <span class="hidden">Google+</span>
            </a>
        
        
    </div>
</footer>

        
    <div class="comments">
        
    </div>

    </article>
</div>

            </div>
        </div>

        <footer class="footer">
            <div class="container">
                <div class="site-title-wrapper">
                    <h1 class="site-title">
                        <a title="Homepage" href="https://blog.steps.info/">Homepage</a>
                    </h1>
                    <a class="button-square button-jump-top js-jump-top" href="#">
                        <i class="fa fa-angle-up"></i>
                    </a>
                </div>

                <p class="footer-copyright">
                    <span>&copy; 2020 / Powered by <a href="https://gohugo.io/">Hugo</a></span>
                </p>
                <p class="footer-copyright">
                    <span><a href="https://github.com/roryg/ghostwriter">Ghostwriter theme</a> By <a href="http://jollygoodthemes.com">JollyGoodThemes</a></span>
                    <span>/ <a href="https://github.com/jbub/ghostwriter">Ported</a> to Hugo By <a href="https://github.com/jbub">jbub</a></span>
                </p>
            </div>
        </footer>

        <script src="https://blog.steps.info/js/jquery-1.11.3.min.js"></script>
        <script src="https://blog.steps.info/js/jquery.fitvids.js"></script>
        <script src="https://blog.steps.info/js/scripts.js"></script>
    </body>
</html>

